<template>
	<view id="remarks">
		<view class="remarks_title">
			<view class="custom-icon custom-icon-biaotiqian"></view>
			<u-icon label="评论此作品"></u-icon>
		</view>
		<view class="textarea">
			<textarea v-model="text" placeholder="再次编辑,发表你的看法" :placeholderStyle="`font-size: 24rpx;`"
				:maxlength="maxlength"></textarea>
			<view class="textCount">{{text.length}}/{{maxlength}}字</view>
		</view>
		<view class="remarks_button">
			<button v-if="!home_id" @click="submit()">发布评论</button>
			<button v-else @click="submitEssay()">发布评论</button>
		</view>
		<u-toast ref="uToast" />
		<view style="height: 100rpx;" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dynamic_id: '',
				pid: '',
				text: '',
				maxlength: 200,
				home_id: null, // 修改为 null
			}
		},
		onLoad(option) {
			console.log(option);
			console.log(this.home_id, "home_id"); // 使用 this.home_id
			this.dynamic_id = option.dynamic_id;
			this.pid = option.pid;
			if (option.home_id) {
				this.home_id = option.home_id;
			}
		},
		methods: {
			submit() { // 修改为 submit
				if (!this.pid || this.pid === "undefined") {
					this.$api.getDynamicReview({
						dynamic_id: this.dynamic_id,
						content: this.text
					}).then(res => {
						console.log(res);
						if (res.code == 1) {
							this.$refs.uToast.show({
								message: '评论成功',
								type: 'success',
								duration: 2000,
								url: ''
							});
							setTimeout(() => {
								uni.redirectTo({
									url: "/pages/home/opusDetail/opusDetail?id=" + this.dynamic_id
								});
							}, 1000); // 1000 毫秒后执行跳转
						}
					});
				} else {
					this.$api.getDynamicReviewTwo({
						dynamic_id: this.dynamic_id,
						pid: this.pid,
						content: this.text
					}).then(res => {
						if (res.code == 1) {
							this.$refs.uToast.show({
								message: '评论成功',
								type: 'success',
								duration: 2000,
							});
							setTimeout(() => {
								uni.redirectTo({
									url: "/pages/home/opusDetail/opusDetail?id=" + this.dynamic_id
								});
							}, 1000); // 1000 毫秒后执行跳转
						}
					});
				}
			},
			submitEssay(){
				this.$api.addComment({
					home_id:this.home_id,
					content:this.text
				}).then(res=>{
					if (res.code == 1) {
						this.$refs.uToast.show({
							message: '评论成功',
							type: 'success',
							duration: 2000,
							url: ''
						});
						setTimeout(() => {
							uni.redirectTo({
								url: "/pages/home/DirectionsUse/DirectionsUse?id=" + this.home_id
							});
						}, 1000); // 1000 毫秒后执行跳转
					}
				})
			}
		}
	}
</script>


<style scoped lang="scss">
	#remarks {
		width: 100%;

	}

	.remarks_title {
		width: 90%;
		margin: auto;
		height: 100rpx;
		display: flex;
		align-items: center;
		border-bottom: 1px #f3f3f3 solid
	}

	.textarea {
		width: 90%;
		margin: auto;
		font-size: 24rpx;
		padding: 20rpx 0;

		.textCount {
			display: flex;
			justify-content: flex-end;
			color: #b7b7b7;
		}
	}

	.remarks_button {
		width: 40%;
		height: 500rpx;
		margin: auto;
		display: flex;
		align-items: center;

		button {
			height: 80rpx;
			line-height: 80rpx;
			background: #ff6500;
			color: #fff;

		}
	}
</style>